@charset "utf-8";
.box {
    width: 500px;
    height: 500px;
    background-color: #F3D9B5;
    display: flex;
}
.box .item1 {
    background-color: #D71A1A;
    height: 100px;
    width: 33.3333%;
}
.box .item2 {
    background-color: #41CF44;
    height: 100px;
    width: 33.3333%;
}
.box .item3 {
    background-color: #329DC4;
    height: 100px;
    width: 33.3333%;
}
.box2 {
    width: 500px;
    height: 500px;
    background-color: #F3D9B5;
    display: flex;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 40px;
    padding-right: 40px;
}
.box2 .item1 {
    background-color: #D71A1A;
    height: 100px;
    width: 33.3333%;
}
.box2 .item2 {
    background-color: #41CF44;
    height: 100px;
    width: 33.3333%;
}
.box2 .item3 {
    background-color: #329DC4;
    height: 100px;
    width: 33.3333%;
}
.box3 {
    width: 500px;
    height: 500px;
    background-color: #F3D9B5;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.box3 .item1 {
    background-color: #D71A1A;
    height: 100px;
    width: 33.3333%;
    margin-left: 33.3333%;
}
.box3 .item2 {
    background-color: #41CF44;
    height: 100px;
    width: 83px;
    float: left;
    margin-left: 33.333%;
}
.box3 .item3 {
    background-color: #329DC4;
    height: 100px;
    width: 83px;
    float: left;
}
